<template>
    <div class="toast" v-if="msg">
        {{msg}}
    </div>
</template>
<script>
export default {
    date() {
        return { msg: "" }
    },
    methods: {
        show(str) {
            this.msg = str;
            setTimeout(()=>this.hide(),2000)
        },
        hide() {
            this.msg = "";
        }
    }
}
</script>
<style>

.Toast{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    padding: 15px;
    border-radius: 4px;
    color: #fff;
    background-color: rgba(0, 0, 0, .4);
}
</style>